<template>
  <div class="setting">
    <component :is="component" :lf="props.lf" :data="props.data" :parameter="props.parameter" />
  </div>
</template>
<script lang="ts">
export default { name: "Setting" };
</script>
<script setup lang="ts">
import { SettingType } from "@/types/logic-flow";
import LogicFlow from "@logicflow/core";
import TableInputSetting from "./setting/tableInput_setting.vue";
import SqlInputSetting from "./setting/sqlInput_setting.vue";
import LeftJoinSetting from "./setting/leftJoin_setting.vue";
import RightJoinSetting from "./setting/rightJoin_setting.vue";
import InnerJoinSetting from "./setting/innerJoin_setting.vue";
import FullJoinSetting from "./setting/fullJoin_setting.vue";
import IndicatorOutputSetting from "./setting/indicatorOutput_setting.vue";
import IndicatorManageAPI, {
  DataSourceList,
  TableListParameter,
} from "@/api/strategy/strategy-index-database";
const props = defineProps<{
  lf?: LogicFlow;
  data: LogicFlow.NodeData | LogicFlow.EdgeData;
  type: SettingType;
  parameter: TableListParameter;
}>();
/**
 * @description 标题
 */
const component = computed(() => {
  let comp = null as any;
  switch (props.type) {
    case "all":
      break;
    case "table_input":
      comp = TableInputSetting;
      break;
    case "sql_input":
      comp = SqlInputSetting;
      break;
    case "left_join":
      comp = LeftJoinSetting;
      break;
    case "right_join":
      comp = RightJoinSetting;
      break;
    case "inner_join":
      comp = InnerJoinSetting;
      break;
    case "full_join":
      comp = FullJoinSetting;
      break;
    case "indicator_output":
      comp = IndicatorOutputSetting;
      break;
  }
  return comp;
});
</script>
<style lang="scss" scoped>
.setting {
  box-sizing: border-box;
  padding: 20px 10px;
}
</style>
